<template>
	<div class="global_order marginTop10">
		<div class="main_white padding10 paddingTop0">
			<div class="main_ti">
				<el-form
					:model="shortMessage_form"
					:inline="false"
					class="demo-form-inline"
					ref="userListFrom"
					label-width="180px"
				>
					<el-form-item class="flex_center" prop="sms_account">
						<span slot="label"> 短信账号： </span>
						<el-input
							v-model="shortMessage_form.sms_account"
							placeholder="短信账号"
						></el-input>
					</el-form-item>
					<el-form-item class="flex_center" prop="sms_password">
						<span slot="label"> 短信密码： </span>
						<el-input
							show-password
							v-model="shortMessage_form.sms_password"
							placeholder="短信密码"
						></el-input>
					</el-form-item>
					<el-form-item class="flex_center" prop="sms_template">
						<span slot="label"> 短信模板： </span>
						<el-input
							v-model="shortMessage_form.sms_template"
							placeholder="短息模板"
						></el-input>
						<span
							>注释：【000000】是验证码的变量，请不要随意修改，否则发送失败！</span
						>
					</el-form-item>
					<el-form-item class="flex_center" prop="baidu_ak">
						<span slot="label"> 短信余量： </span>

						<span>剩余{{ shortMessage_form.sms_stock }}条</span>
					</el-form-item>
					<el-form-item class="flex_center" prop="sms_notice_number">
						<span slot="label"> 余量提醒： </span>
						<el-switch
							v-model="shortMessage_form.sms_notice"
							active-text="开"
							inactive-text="关"
							class="mainor_switch"
							active-color="#03A98E"
						></el-switch>
					</el-form-item>
					<el-form-item
						prop="sms_notice_number"
						v-if="shortMessage_form.sms_notice"
					>
						<span slot="label"> 最低提醒数量： </span>
						<el-input
							v-model="shortMessage_form.sms_notice_number"
							placeholder="最低提醒数量"
							class="number_input"
						></el-input>
					</el-form-item>
					<el-form-item prop="sms_notice_number">
						<span slot="label">微信模板消息： </span>
						<li class="wechat_tempalte_item">
							<span>代下单成功(用户)</span>
							<el-checkbox
								v-model="shortMessage_form.send_message_order_to_user_status"
								@change="
									handleChangeCheckbox(
										$event,
										'send_message_order_to_user_status'
									)
								"
							>
							</el-checkbox>
						</li>
						<li class="wechat_tempalte_item">
							<span>代下单成功(业务员)</span>
							<el-checkbox
								v-model="
									shortMessage_form.send_message_order_to_salesman_status
								"
								@change="
									handleChangeCheckbox(
										$event,
										'send_message_order_to_salesman_status'
									)
								"
							>
							</el-checkbox>
						</li>
						<li class="wechat_tempalte_item">
							<span>订单发货(司机)</span>
							<el-checkbox
								v-model="
									shortMessage_form.send_message_order_delivery_to_driver_status
								"
								@change="
									handleChangeCheckbox(
										$event,
										'send_message_order_delivery_to_driver_status'
									)
								"
							>
							</el-checkbox>
						</li>
						<li class="wechat_tempalte_item">
							<span>生成采收单(采购员)</span>
							<el-checkbox
								v-model="
									shortMessage_form.send_message_purchase_order_to_buyer_status
								"
								@change="
									handleChangeCheckbox(
										$event,
										'send_message_purchase_order_to_buyer_status'
									)
								"
							>
							</el-checkbox>
						</li>
						<li class="wechat_tempalte_item">
							<span>生成采购单(供应商)</span>
							<el-checkbox
								v-model="
									shortMessage_form.send_message_purchase_order_to_supplier_status
								"
								@change="
									handleChangeCheckbox(
										$event,
										'send_message_purchase_order_to_supplier_status'
									)
								"
							>
							</el-checkbox>
						</li>
					</el-form-item>
					<div class="clearfix"></div>
					<div class="newConBox_p100 paddingBottom10" id="newConBox">
						<div class="newConBox_h32">
							<div>
								<el-button type="primary" @click="preservation" v-repeatClick
									>保存</el-button
								>
							</div>
						</div>
					</div>
				</el-form>
			</div>
		</div>
	</div>
</template>

<script>
	import { setting_company, company_sendMessage } from "@/api/currency";
	import { apiUrl, objKeySort, Md5 } from "@/utils/public";
	import { jsonStringifyBack } from "@/utils";
	export default {
		props: {
			form: {
				type: Object,
			},
		},
		data() {
			return {
				shortMessage_form: {
					sms_account: "", //短信账号
					sms_password: "",
					sms_template: "",
					sms_notice: true,
					sms_notice_number: 50,
					sms_stock: "",
					send_message_order_delivery_to_driver_status: false, //司机
					send_message_order_to_salesman_status: false, //业务员
					send_message_order_to_user_status: false, //用户
					send_message_purchase_order_to_buyer_status: false, //采购员
					send_message_purchase_order_to_supplier_status: false, //供应商
				},
				checked: false,
			};
		},
		mounted() {
			this.shortMessage_form = this.form;
		},
		watch: {},
		created() {},
		methods: {
			preservation() {
				let form = JSON.parse(
					JSON.stringify(this.shortMessage_form, jsonStringifyBack)
				);
				form.send_message_order_delivery_to_driver_status =
					form.send_message_order_delivery_to_driver_status ? 1 : 0;
				form.send_message_order_to_salesman_status =
					form.send_message_order_to_salesman_status ? 1 : 0;
				form.send_message_order_to_user_status =
					form.send_message_order_to_user_status ? 1 : 0;
				form.send_message_purchase_order_to_buyer_status =
					form.send_message_purchase_order_to_buyer_status ? 1 : 0;
				form.send_message_purchase_order_to_supplier_status =
					form.send_message_purchase_order_to_supplier_status ? 1 : 0;
				let { sms_stock, ...sz } = form;
				this.$emit("save", { data: sz });
			},
			handleChangeCheckbox($event, type) {
				let value = $event;
				let form = {
					[type]: $event ? 1 : 0,
				};
				this.company_sendMessage(form).then((res) => {
					if (res.errcode != 0) {
						this.$message.error(res.errmsg);
						this.$nextTick(() => {
							this.shortMessage_form[type] = !value;
						});
					}
				});
			},
			company_sendMessage(form) {
				let data = Object.assign(
					apiUrl().name,
					form
				);
				return company_sendMessage(data);
			},
		},
	};
</script>

<style lang="scss" scoped>
@import "@/styles/variables.scss";

/deep/.el-input {
	width: 400px;
}
.number_input {
	width: 200px !important;
}
.wechat_tempalte_item {
	display: flex;
	align-items: center;
	color: #606266;
	span {
		margin-right: 10px;
		min-width: 125px;
	}
}
</style>